<template>
  <div class="card_page">
    <!-- 头部 -->
    <div class="header">
      <img class="header_bg" src="@/assets/img/cardbg.png" alt />
      <div class="header_cont text-center">
        <div class="header_title rem-36px text-ff">{{data.shorter_name}}</div>

        <div class="header_info radius-10">
          <div class="header_info_one radius-10">
            <img class="cover_img" v-if="data.logo" :src="data.logo" alt />
            <img class="cover_img" v-if="!data.logo" src="@/assets/img/nodata.png" alt />
            <div
              class="cover_icon text-ff"
              :style="{'background': data.is_auth?'rgba(102, 102, 102, 1)':''}"
            >
              &nbsp;
              <i v-if="!data.is_auth" class="iconfont icon-weibiaoti-_huaban"></i>
              <i v-if="data.is_auth" class="iconfont icon-renzheng"></i>
              &nbsp;{{data.is_auth?'已认证':'未认证'}}
            </div>
          </div>
          <div class="margin-tb30 transformY50">{{data.enterprise_title}}</div>
          <div class="margin-tb30 transformY50 rem-24px">{{data.ad_name}}</div>
          <div class="cardlogo transformY50 flex justify-center">
            <img
              v-for="(item,index) in fixed.medal"
              :key="index"
              v-lazy="item.thumb"
              @click="go(item.medal_url)"
              alt
            />
          </div>
          <div class="transformY50 rem-22px margin-tb15" v-if="data.is_auth">
            <span v-if="fixed.grade_name" class="border-ff6 c-ff0">{{fixed.grade_name}}</span>
            <span v-if="fixed.grade_name">
              <span class="c-ff0">{{fixed.year_num}}</span>年
            </span>
          </div>

          <div class="header_info_s padding-tb35 rem-26px transformY50">
            <span>文章：{{fixed.article_num}}</span>|
            <span>关注度：{{fixed.attention_num}}</span>|
            <span>申请：{{fixed.apply_num}}</span>
          </div>
        </div>
      </div>
    </div>

    <!-- 关于我们 -->
    <div class="about border-bottom" v-if="data.enterprise_content">
      <navtitle>
        <span slot="title_one">关于</span>
        <span slot="title_two">我们</span>
        <span slot="title_three">ABOUT US</span>
      </navtitle>
      <div class="about_cont">
        <div
          ref="about_text"
          :class="[aboutType?'':'about_text','rem-32px' ,'line-50']"
          v-html="data.enterprise_content"
        >{{data.enterprise_content}}</div>
        <div class="about_more text-center" @click="aboutTypeChange" ref="about" v-if="!aboutType">
          <div>展开更多</div>
          <van-icon name="arrow-down" />
        </div>
        <div class="about_more text-center" @click="aboutTypeChange" ref="about" v-if="aboutType">
          <div>点击关闭</div>
          <van-icon name="arrow-up" />
        </div>
      </div>
    </div>

    <!-- 关于我们2 -->
    <!-- address
    email
    qq
    wechat-->
    <div class="about2 line-50">
      <ul>
        <li v-if="fixed.business_cate">
          <span>
            经营项目：
            <span
              v-for="(item,index) in fixed.business_cate.split(',')"
              :key="index"
            >{{item}}{{index==fixed.business_cate.split(',').length-1?' ':'、'}}</span>
          </span>
        </li>
        <li>
          <div v-if="cityList.length > 2">
            <span>区域: {{cityList.join(',')}}</span>
          </div>
          <div v-if="data.address">
            <span>地址: {{data.address}}</span>
          </div>
          <div v-if="data.email">
            <span>邮箱: {{data.email}}</span>
          </div>
          <div v-if="data.qq">
            <span>企业QQ: {{data.qq}}</span>
          </div>
          <div v-if="data.wechat">
            <span>企业微信: {{data.wechat}}</span>
          </div>
          <!-- <div v-for="(item,index) in expose" :key="index">
            <span v-if="item.value">{{item.title}}：{{item.value}}</span>
          </div>-->
        </li>
      </ul>
    </div>

    <!-- 公司宣传片 -->
    <div class="spread" v-if="data.enterprise_xc">
      <div class="spread_cont">
        <navtitle>
          <span slot="title_one">公司</span>
          <span slot="title_two">宣传片</span>
          <span slot="title_three">AD</span>
        </navtitle>
        <div style="min-height: 200px;" :id="'plv_' + data.enterprise_xc"></div>
        <!-- <div class="spread_video" v-html="data.enterprise_xc">{{data.enterprise_xc}}</div> -->
      </div>
    </div>

    <div class="gray bg-f5">
      <!-- 公司荣誉 -->
      <div class="honor bg-ff" v-if="infoData.honor!=undefined && infoData.honor.length > 0">
        <navtitle>
          <span slot="title_one">公司</span>
          <span slot="title_two">荣誉</span>
          <span slot="title_three">COMPANY HONOR</span>
        </navtitle>
        <div class="honor_super rem-26px text-center text-content">
          <div
            class="honor_ul"
            :style="[{width: (infoData.honor!=undefined && infoData.honor.length > 0 ? infoData.honor.length * 35 : '') + '%'}]"
          >
            <div class="honor_li" v-for="(item,index) in infoData.honor" :key="index">
              <img v-lazy="item.thumb" @click="bighon(infoData.honor, index)" alt />
              <div>{{item.brand_title}}</div>
            </div>
          </div>
        </div>
      </div>

      <!-- 自有品牌 -->
      <div class="honor bg-ff" v-if="infoData.own!=undefined && infoData.own.length > 0">
        <navtitle>
          <span slot="title_one">自有</span>
          <span slot="title_two">品牌</span>
          <span slot="title_three">OWN BRAND</span>
        </navtitle>
        <div class="honor_super rem-26px text-center text-content">
          <div
            class="honor_ul"
            :style="[{width: (infoData.own!=undefined && infoData.own.length > 0 ? infoData.own.length * 35 : '') + '%'}]"
          >
            <div class="honor_li" v-for="(item,index) in infoData.own" :key="index">
              <img v-lazy="item.thumb" @click="bigimg(item.brand_url)" alt />
              <div>{{item.brand_title}}</div>
            </div>
          </div>
        </div>
      </div>

      <!-- 代理品牌 -->
      <div class="honor bg-ff" v-if="infoData.agent!=undefined && infoData.agent.length > 0">
        <navtitle>
          <span slot="title_one">代理</span>
          <span slot="title_two">品牌</span>
          <span slot="title_three">AGENT BRAND</span>
        </navtitle>
        <div class="honor_super rem-26px text-center text-content">
          <div
            class="honor_ul"
            :style="[{width: (infoData.agent!=undefined && infoData.agent.length > 0 ?  infoData.agent.length * 35:'') + '%'}]"
          >
            <div class="honor_li" v-for="(item,index) in infoData.agent" :key="index">
              <img v-lazy="item.thumb" @click="bigimg(item.brand_url)" alt />
              <div>{{item.brand_title}}</div>
            </div>
          </div>
        </div>
      </div>

      <!-- 销售品牌 -->
      <div class="honor bg-ff" v-if="infoData.sale!=undefined && infoData.sale.length > 0">
        <navtitle>
          <span slot="title_one">销售</span>
          <span slot="title_two">品牌</span>
          <span slot="title_three">SALES BRAND</span>
        </navtitle>
        <div class="honor_super rem-26px text-center text-content">
          <div
            class="honor_ul"
            :style="[{width: (infoData.sale!=undefined && infoData.sale.length > 0 ?  infoData.sale.length* 35:'') + '%'}]"
          >
            <div class="honor_li" v-for="(item,index) in infoData.sale" :key="index">
              <img v-lazy="item.thumb" @click="bigimg(item.brand_url)" alt />
              <div>{{item.brand_title}}</div>
            </div>
          </div>
        </div>
      </div>

      <!-- 招商项目 -->
      <div class="honor bg-ff" v-if="fixed.business">
        <navtitle>
          <span slot="title_one">招商</span>
          <span slot="title_two">项目</span>
          <span slot="title_three">SALES BRAND</span>
        </navtitle>
        <div class="recruit_img">
          <div v-html="fixed.business">{{fixed.business}}</div>
          <!-- <img src="@/assets/img/cardbg3.png" alt /> -->
        </div>
      </div>

      <!-- 代理/经销商 -->
      <div class="honor bg-ff" v-if="agent.length > 0">
        <navtitle>
          <span slot="title_one">代理</span>
          <span slot="title_two">/经销商</span>
          <span slot="title_three">AGENT/DISTRIBUTOR</span>
          <span slot="title_icon" @click="to('agent',enterprise_id)">
            <span class="iconfont icon-xiangyou"></span>
          </span>
        </navtitle>
        <div>
          <div
            class="agent_li flex"
            v-for="(item,index) in agent"
            :key="index"
            @click="to('card', item.id)"
          >
            <img class="agent_li_img" v-if="item.logo" v-lazy="item.logo" alt />
            <img class="agent_li_img" v-if="!item.logo" src="@/assets/img/nodata.png" alt />
            <div class="flex-grow">
              <div class="rem-32px text-content text-cut-two">{{item.enterprise_title}}</div>
              <div class="flex justify-between margin-t40">
                <div class="rem-26px c-66">类别: {{item.type_name}}</div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 联系人 -->
      <div class="honor bg-ff" v-if="token && link.length > 0">
        <navtitle>
          <span slot="title_two">联系人</span>
          <span slot="title_three">CONTACT</span>
          <span slot="title_icon" @click="to('contactsList', enterprise_id)">
            <span class="iconfont icon-xiangyou"></span>
          </span>
        </navtitle>
        <div class="contact">
          <div
            class="contact_li flex align-center text-content"
            v-for="(item, index) in link"
            :key="index"
          >
            <img class="radius-50p margin-r15" v-lazy="item.head_img?item.head_img:$nologin" alt />
            <div class="flex-grow" @click="to('recruit-card', item.link_id, 2)">
              <div>
                <span class="rem-30px">{{item.user_name}}</span>&emsp;
                <span class="c-99 rem-24px">{{item.position_name}}</span>
              </div>
              <div class="rem-20px">{{item.user_phone}}</div>
            </div>
            <div class="contact_icon">
              <i
                v-if="item.friendSta == 2"
                class="iconfont icon-jiahaoyou"
                @click="getAplly(1,item.link_id)"
              ></i>
              <a :href="'tel:'+item.user_phone">
                <i v-if="item.friendSta == 1" class="iconfont icon-boda"></i>
              </a>
              <i
                v-if="item.friendSta == -1"
                class="iconfont icon-gengxin"
                @click="getAplly(2,item.link_id)"
              ></i>
              <i v-if="item.friendSta == 0" class="iconfont icon-shijian"></i>
            </div>
          </div>
        </div>
        <div
          style="text-align: center;font-size: 0.26rem;color: red;padding: 0.2rem 0;"
          @click="to('contactsList', enterprise_id)"
        >查看更多>></div>
      </div>
    </div>

    <div class="bg-ff padding-lr20 margin-t20 padding-b100">
      <tab :tabList="tabList" :tabIndex="tabIndex" @tabChange="getList"></tab>
      <!-- 最新资讯 -->
      <div v-if="tabIndex==0" class="news">
        <div
          class="flex news_li w-100p"
          v-for="(item, index) in article"
          :key="index"
          @click="to('recruit-news',item.article_id)"
        >
          <img class="margin-r24" v-if="item.thumb" v-lazy="item.thumb" alt />
          <img class="margin-r24" v-if="!item.thumb" src="@/assets/img/nodata.png" alt />
          <div class="flex-grow overflow-hidden">
            <div class="rem-32px text-cut-two text-content">{{item.article_title}}</div>
            <div class="flex justify-between news_li_s">
              <!-- <div
                class="rem-20px c-66 news_li_tip flex-two text-cut-one margin-r20"
              >{{item.enterprise_title}}</div>-->
              <div class="rem-20px c-66 flex-one text-cut-one">{{item.created_at.slice(0,10)}}</div>
            </div>
          </div>
        </div>
        <div class="text-center rem-26px line-50 c-99" v-if="article.length == 0">暂无最新资讯</div>
        <div
          class="text-center rem-26px line-50 c-ff0"
          v-if="article.length != 0"
          @click="moduo('recruit-info')"
        >查看更多>></div>
      </div>

      <!-- 申请记录 -->
      <div v-if="tabIndex==1">
        <div class="record_li flex padding-tb20" v-for="(item,index) in article" :key="index">
          <img class="radius-50p margin-r24" v-if="item.head_img" v-lazy="item.head_img" alt />
          <img
            class="radius-50p margin-r24"
            v-if="!item.head_img"
            src="@/assets/img/nologin.png"
            alt
          />
          <div class="flex-grow flex flex-column text-content">
            <div class="rem-30px overflow-hidden">
              <span class="fl">{{item.user_phone}}</span>
              <span class="fr">提交了代理申请了代理</span>
            </div>
            <div class="rem-24px overflow-hidden">
              <span class="fl c-99">{{item.enterprise_title}}</span>
              <span class="fr c-99">{{item.created_at}}</span>
            </div>
          </div>
        </div>
        <div class="text-center rem-26px line-50 c-99" v-if="article.length == 0">暂无申请记录</div>
        <div
          class="text-center rem-26px line-50 c-ff0"
          v-if="article.length != 0"
          @click="moduo('applyHistroy')"
        >查看更多>></div>
      </div>

      <!-- 浏览记录 -->
      <div v-if="tabIndex==2">
        <div class="record_li flex padding-tb20" v-for="(item,index) in article" :key="index">
          <img class="radius-50p margin-r24" v-if="item.head_img" v-lazy="item.head_img" alt />
          <img
            class="radius-50p margin-r24"
            v-if="!item.head_img"
            src="@/assets/img/nologin.png"
            alt
          />
          <div class="flex-grow flex flex-column text-content">
            <div
              class="rem-30px overflow-hidden text-cut-one"
            >{{item.user_name?item.user_name:item.user_phone}}</div>
            <div class="rem-24px overflow-hidden">
              <span class="fl c-99">{{item.user_phone}}</span>
              <span class="fr c-99">{{item.created_at}}</span>
            </div>
          </div>
        </div>
        <div class="text-center rem-26px line-50 c-ff0" @click="moduo('recordList')">查看更多>></div>
      </div>
    </div>

    <!-- 底部 -->
    <div
      class="footer bg-ff flex justify-between text-center"
      :style="[{'z-index': downShow?'1001':'1001'}]"
    >
      <div class="flex flex-grow justify-around align-center text-content rem-24px">
        <div class="c-ff0" @click="$router.push('/')">
          <i class="iconfont icon-shouye1-copy"></i>
          <div>首页</div>
        </div>
        <div class="c-99" @click="downShow=true" v-if="through.length > 0">
          <i class="iconfont icon-diqiu"></i>
          <div>直通</div>
        </div>
        <div class="c-99" @click="getCollect">
          <i :class="['iconfont', collect ? 'icon-shoucang c-ff0':'icon-shoucang1']"></i>
          <div>收藏</div>
        </div>
        <div class="c-99">
          <i class="iconfont icon-lianxi"></i>
          <div>
            <!-- <a v-if="customer_phone" :href="'tel:' + data.enterprise_phone">联系</a> -->
            <div @click="customerShow = true">联系</div>
          </div>
        </div>
      </div>
      <div class="bg-ff0 text-ff btn" @click="apply">申请</div>
    </div>

    <!-- 客服电话浮层customerShow -->
    <van-overlay :show="customerShow" z-index="999" @click="customerShow = false">
      <div class="wrapper">
        <div class="radius-15 position-center bg-ff rem-26px padding-b20" @click.stop>
          <div class="up_li bg-ff text-center text-bold border-bottom">业务咨询电话</div>
          <!-- <div class="bg-ff text-center c-99 rem-24px line-20 text-content">(请点击拨打)</div> -->
          <div>
            <div v-for="(item, index) in customer" :key="index" class="up_li h-80">
              <a :href="'tel:' + item.user_phone">{{item.user_name}}： {{item.user_phone}}</a>
            </div>
          </div>
        </div>
      </div>
    </van-overlay>
    <!-- 申请浮层 -->
    <div class="up_bg z-1003" v-if="upShow">
      <div class="radius-15 position-center bg-ff rem-32px padding-b20">
        <div class="up_li text-center text-bold border-bottom">申请成为代理</div>
        <div class="up_li flex justify-between border-bottom align-center">
          <div>姓名</div>
          <div>
            <input type="text" v-model="xm" placeholder="姓名" />
          </div>
        </div>
        <div class="up_li flex justify-between border-bottom align-center">
          <div class="word-all">手机号</div>
          <div>
            <input type="text" v-model="sj" placeholder="手机号" />
          </div>
        </div>
        <div class="up_li flex justify-between border-bottom align-center">
          <div>公司</div>
          <div>
            <input type="text" v-model="gs" placeholder="公司" />
          </div>
        </div>
        <div class="padding-b20">
          <div class="up_li_s">备注</div>
          <div class="padding-lr20 margin-b20">
            <textarea class="radius-15" v-model="content" cols="30" rows="10"></textarea>
          </div>
        </div>
        <div
          class="login padding-lr20 margin-t20 text-ff rem-34px flex justify-between text-center"
        >
          <div class="bg-ff0" @click="setAgent">确定申请</div>
          <div class="bg-bcb" @click="upShow= false">取消申请</div>
        </div>
      </div>
    </div>

    <!--  -->
    <div class="up_bg" v-if="downShow && through.length > 0">
      <div class="down_off" @click="downShow=false"></div>
      <div class="down_ul radius-15 bg-ff flex flex-wrap text-center text-content">
        <div
          class="down_li"
          v-for="(item,index) in through"
          :key="index"
          v-show="item.url"
          @click="go(item.url)"
        >
          <img :src="item.icon?item.icon:$nodata" alt />
          <div class="c-66 rem-24px">{{item.c_name}}</div>
        </div>
      </div>
    </div>
  </div>
</template>



<script src='//player.polyv.net/script/polyvplayer.min.js'></script>
<script>
function playVid() {
  let time = setInterval(() => {
    if (window.localStorage.getItem("vid")) {
      clearInterval(time);
      var player = polyvObject(
        "#plv_" + window.localStorage.getItem("vid")
      ).videoPlayer({
        width: "100%",
        height: "200",
        vid: window.localStorage.getItem("vid"),
        forceH5: true
      });
      window.localStorage.removeItem("vid");
    }
  }, 1000);
}
import axios from "axios";
import navtitle from "../components/navtitle";
import tab from "../components/tab";
import { ImagePreview } from "vant"; //放大
import cardVue from "./recruit/card.vue";
const jsApiList = ["onMenuShareAppMessage", "onMenuShareTimeline"];
let wx = {};
if (process.client) {
  wx = require("weixin-js-sdk");
}
export default {
  components: {
    navtitle,
    tab
  },
  inject: ["reload"],
  data() {
    return {
      aboutType: false,
      honorList: 5,
      tabList: ["最新资讯", "申请记录", "浏览记录"],
      tabIndex: 0,
      list: 2,
      upShow: false,
      content: "", //备注
      downShow: false,
      enterprise_id: this.$route.query.id, // id
      data: {}, // 页面数据
      infoData: {}, // 公司荣誉,
      agent: {}, // 代理商经销商
      link: {}, //联系人
      article: [], // 列表
      total: 0,
      collect: false, // 收藏状态
      fixed: {},
      fields: {},
      expose: "",
      token: false,
      xm: "", // 申请信息
      sj: "",
      gs: "",
      fenxiang: false,
      through: [], // 直通车
      customerShow: false,
      customer: "", // 客服电话
      cityList: [] //区域
    };
  },
  watch: {
    data: function() {
      this.$nextTick(function() {
        if (JSON.stringify(this.$refs) != "{}") {
          if (
            this.$refs.about_text.clientHeight <
            1.5 * (document.documentElement.clientWidth / 7.5)
          ) {
            this.$refs.about.style.display = "none";
          }
        }
      });
    }
  },
  mounted() {
    document.querySelector("html").style.backgroundColor = "#f5f5f5";
    this.token = window.localStorage.getItem("token") ? true : false;
    this.getIndex();
    this.getArticle(1);
    this.getBrowsing();
    this.getLink();
    const s = document.createElement("script");
    s.type = "text/javascript";
    s.src = "//player.polyv.net/script/polyvplayer.min.js";
    document.body.appendChild(s);
  },
  methods: {
    getUrl() {
      let that = this;
      let url = window.location.href;
      this.$axios
        .post("/common/util/sign", {
          url: url
        })
        .then(res => {
          let timestamp = res.data.data.timestamp;
          let nonceStr = res.data.data.noncestr;
          let signature = res.data.data.sign;

          wx.config({
            debug: false,
            appId: "wxc776bb6f53038a01",
            timestamp: timestamp,
            nonceStr: nonceStr,
            signature: signature,
            jsApiList: jsApiList
          });

          wx.ready(function() {
            wx.onMenuShareTimeline({
              title: that.data.enterprise_title + " - 链配名片", // 分享标题
              link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
              imgUrl: that.data.logo, // 分享图标
              success() {
                // that.$toast("分享朋友圈成功");
                // 用户确认分享后执行的回调函数
              },
              cancel() {
                // 用户取消分享后执行的回调函数
              }
            });
            wx.onMenuShareAppMessage({
              title: that.data.enterprise_title + " - 链配名片", // 分享标题
              desc: `${that.data.shorter_name}-${that.data.ad_name}`, // 分享描述
              link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
              imgUrl: that.data.logo, // 分享图标
              success: function() {
                that.$toast("分享给朋友成功");
                // 用户确认分享后执行的回调函数
              },
              cancel: function() {
                // 用户取消分享后执行的回调函数
              }
            });
          });
        });
    },
    // 显示更多
    aboutTypeChange() {
      this.aboutType = !this.aboutType;
    },
    getList(e) {
      this.tabIndex = e;
      this.article = [];
      this.getArticle(1);
    },
    // 申请代理的浮层
    apply() {
      if (!this.token) {
        this.$toast("请退出企业后台后 登录个人账户进行操作");
        this.$router.push({
          name: "recruit-login",
          query: {
            type: "card"
          }
        });
        return false;
      }
      this.upShow = true;
      this.$axios
        .post("/wap/personal/card", {
          token: window.localStorage.getItem("token"),
          type: 1
        })
        .then(res => {
          this.xm = res.data.data.user.user_name;
          this.sj = res.data.data.user.user_phone;
          this.gs = res.data.data.user.company_name;
        });
    },
    // 申请代理
    setAgent() {
      if (!this.xm || !this.sj || !this.gs || !this.content) {
        this.$toast("内容不能为空哦~");
        return false;
      }
      this.$axios
        .post("/wap/handle/agent", {
          token: window.localStorage.getItem("token"),
          type: 1,
          enterprise_id: this.enterprise_id,
          apply_name: this.xm,
          apply_phone: this.sj,
          apply_company: this.gs,
          content: this.content
        })
        .then(res => {
          this.$toast(res.data.msg);
          if (res.data.code == 0) {
            this.upShow = false;
          }
        });
    },
    // 获取总数据
    getIndex() {
      this.$axios
        .post("/wap/enterprise/index", {
          token: window.localStorage.getItem("token")
            ? window.localStorage.getItem("token")
            : "",
          enterprise_id: this.enterprise_id
        })
        .then(res => {
          this.data = res.data.data.enterprise;
          this.customer = res.data.data.customer_phone;
          if (!this.customer) {
            this.getCustomer();
          }
          if (this.data.enterprise_xc) {
            window.localStorage.setItem("vid", this.data.enterprise_xc);
            playVid();
          }
          for (let b in res.data.data.through) {
            if (res.data.data.through[b].url) {
              this.$set(this.through, b, res.data.data.through[b]);
            }
          }
          this.fixed = res.data.data.fixed;
          if (this.fixed.business) {
            this.fixed.business.replace(
              /<img/g,
              "<img style='max-width:100%;height:auto;'"
            );
          }
          // if (this.data.enterprise_xc) {
          //   this.data.enterprise_xc.replace(
          //     /<img/g,
          //     "<img style='max-width:100%;height:auto;'"
          //   );
          // }
          this.infoData = res.data.data.node;
          this.fields = res.data.data.fields;
          this.getUrl();
          let expose = [];
          for (let i in this.data) {
            for (let j in this.fields) {
              if (i == this.fields[j].field_name) {
                expose.push({
                  title: this.fields[j].c_name,
                  name: i,
                  value: this.data[i]
                });
                this.expose = expose;
              }
            }

            if (i == "area_name") {
              this.setCity();
            }
          }
          if (this.fixed.is_collect == 1) {
            this.collect = true;
          }
        });
    },
    // 城市匹配文字
    setCity() {
      for (let i in this.data) {
        if (i == "area_name") {
          let e = this.data[i].split(",");
          let id = "";
          if (e.length > 3) {
            id = this.data[i].split(",").slice(1, 4);
          } else {
            id = this.data[i].split(",");
          }
          for (let j in id) {
            if (id[j] != undefined) {
              this.$axios
                .post("/common/getRegion", {
                  id: j == 0 ? 0 : id[j - 1]
                })
                .then(res => {
                  let data = res.data.data;
                  for (let c in data) {
                    if (data[c].id == id[j]) {
                      this.$set(this.cityList, j, data[c].name);
                    }
                  }
                });
            }
          }
        }
      }
    },
    // 收藏
    getCollect() {
      if (!window.localStorage.getItem("token")) {
        this.$toast("请退出企业后台后 登录个人账户进行操作");
        this.$router.push({
          name: "recruit-login",
          query: {
            type: "card"
          }
        });
        return false;
      }
      this.$axios
        .post("/wap/enterprise/collect", {
          token: window.localStorage.getItem("token"),
          enterprise_id: this.enterprise_id
        })
        .then(res => {
          this.$toast(res.data.msg);
          if (res.data.msg == "收藏成功") {
            this.collect = true;
          } else {
            this.collect = false;
          }
        });
    },
    // 资讯新闻 申请记录 浏览记录
    getArticle() {
      let ajaxurl = "";
      if (this.tabIndex == 0) {
        ajaxurl = "/wap/info/article";
      } else if (this.tabIndex == 1) {
        ajaxurl = "/wap/info/apply";
      } else if (this.tabIndex == 2) {
        ajaxurl = "/wap/info/browsing";
      }
      this.$axios
        .post(ajaxurl, {
          enterprise_id: this.enterprise_id,
          page: 1,
          limit: 10
        })
        .then(res => {
          this.list = [];
          this.topList = [];
          for (let i in res.data.data) {
            this.article.push(res.data.data[i]);
          }
        });
    },
    // 代理商经销商
    getBrowsing() {
      this.$axios
        .post("/wap/info/agent", {
          enterprise_id: this.enterprise_id,
          page: 1,
          limit: 4
        })
        .then(res => {
          this.agent = res.data.data;
        });
    },
    // 联系人
    getLink() {
      if (!this.token) {
        return false;
      }
      this.$axios
        .post("/wap/info/link", {
          token: window.localStorage.getItem("token"),
          enterprise_id: this.enterprise_id,
          page: 1,
          limit: 10
        })
        .then(res => {
          this.link = res.data.data;
        });
    },
    // 好友申请
    getAplly(type, id) {
      if (!this.token) {
        return false;
      }
      this.$axios
        .post("/wap/handle/friend", {
          token: window.localStorage.getItem("token"),
          type: type,
          link_id: id
        })
        .then(res => {
          this.$toast(res.data.msg);
          this.getLink();
        });
    },
    // 携带参数跳转
    to(path, id, type) {
      if (type) {
        this.$router.push({
          name: path,
          query: {
            type: type,
            id: id
          }
        });
        return false;
      }
      this.$router.push({
        name: path,
        query: {
          id: id
        }
      });
      if (path == "card") {
        window.scroll(0, 0);
        this.reload();
      }
    },
    go(path) {
      window.open(path, "_blank");
    },
    bighon(item, index) {
      let url = [];
      for (let i in item) {
        url.push(item[i].thumb);
      }
      ImagePreview({
        images: url,
        startPosition: index
      });
    },
    bigimg(path) {
      if (path) {
        window.open(path, "_blank");
      }
    },
    moduo(path) {
      this.$router.push({
        name: path,
        query: {
          id: this.enterprise_id
        }
      });
    },
    // 拨打客服电话
    getCustomer() {
      this.$axios.post("/wap/config/customer", {}).then(res => {
        this.customer = res.data.data;
      });
    }
  }
};
</script>


<style scoped>
/* 申请记录浮层 */
.down_off {
  position: absolute;
  z-index: 98;
  width: 100%;
  height: 100%;
}
.down_ul {
  width: 6.98rem;
  position: absolute;
  z-index: 99;
  bottom: 1.2rem;
  left: 50%;
  transform: translateX(-50%);
  padding-top: 0.5rem;
}
.down_li {
  width: 25%;
  padding-bottom: 0.5rem;
}
.down_li img {
  width: 0.8rem;
  height: 0.8rem;
  display: inline-block;
}
/* 申请代理浮层 */
.up_bg {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.6);
}
.up_li {
  padding: 0 0.2rem;
  height: 1rem;
  line-height: 1rem;
}
.up_li div:first-of-type {
  width: 1.5rem;
}
.up_li input {
  width: 100%;
  height: 100%;
  text-align: right;
}
.up_bg textarea {
  width: 5.8rem;
  height: 2rem;
  outline: none;
  resize: none;
  border: 0.01rem solid #d1d1d1;
}
.up_li_s {
  padding: 0 0.2rem;
  height: 0.8rem;
  line-height: 0.8rem;
}
.login {
  height: 0.9rem;
  line-height: 0.9rem;
}
.login > div {
  width: 2.8rem;
  border-radius: 0.15rem;
}
/* 底部 */
.footer {
  position: fixed;
  z-index: 9;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.88rem;
}
.footer .iconfont {
  font-size: 0.3rem;
}

.footer .btn {
  width: 2rem;
  line-height: 0.88rem;
}
/* 申请记录 */
.record_li img {
  width: 0.94rem;
  height: 0.94rem;
}

/*  */

.header {
  background: #f4f4f4;
  position: relative;
}

.header .header_bg {
  position: absolute;
  z-index: 1;
  width: 100%;
  top: -1.38rem;
  left: 0;
}

.header .header_cont {
  padding: 0.5rem 0.4rem 0.15rem;
  position: relative;
  z-index: 99;
  top: 0;
  left: 0;
}

.header_title {
  padding-bottom: 1rem;
}

.header_info {
  /* height: 4rem; */
  background: white;
}

.header_info_one {
  height: 2.26rem;
  overflow: hidden;
  position: relative;
  display: inline-block;
  top: -0.5rem;
}

.cover_img {
  width: 2.26rem;
  height: 2.26rem;
}

.cover_icon .iconfont {
  font-size: 0.22rem;
}

.cover_icon {
  width: 100%;
  height: 0.44rem;
  line-height: 0.44rem;
  background: rgba(255, 51, 51, 0.6);
  font-size: 0.22rem;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 99;
}

.cardlogo img {
  margin: 0 0.15rem;
  width: 0.6rem;
  height: 0.6rem;
  object-fit: contain;
}

.header_info_s span {
  display: inline-block;
  padding: 0 0.26rem;
}

/* 关于我们 */

.about {
  padding: 0 0.2rem;
  background: white;
}

.about_title {
  height: 1rem;
  line-height: 1rem;
  padding: 0 0.15rem;
}

.about_cont {
  padding: 0.18rem 0.15rem;
}

.about_more {
  font-size: 0.22rem;
  color: #999;
}

.about_text {
  /* height: 2rem; */
  max-height: 2rem;
  text-overflow: ellipsis;
  white-space: normal;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.about_more .iconfont {
  font-size: 0.14rem;
  display: inline-block;
  margin-top: 0.13rem;
}

.about2 {
  padding: 0.4rem 0.2rem;
  background: white;
}

.about2 ul {
  list-style-type: square;
  font-size: 0.28rem;
  margin-left: 0.32rem;
}

.about2 ul:last-of-type {
  list-style-type: none;
}

.about2 li {
  margin-bottom: 0.1rem;
}

/* 宣传片 */

.spread {
  background: #f4f4f4;
  padding-top: 0.2rem;
}

.spread_cont {
  background: white;
  padding: 0 0.2rem 0.2rem;
}

.spread_video {
  padding: 0.2rem 0;
}

.spread_video video {
  width: 100px;
  height: 100%;
  object-fit: fill;
}

.gray {
  border: 0.01rem solid transparent;
}

/* 荣誉 */
.honor {
  margin-top: 0.2rem;
  padding: 0 0.2rem;
}

.honor_super {
  padding: 0.2rem 0;
  overflow-x: scroll;
}
.honor_ul {
  overflow: hidden;
}
.honor_li {
  float: left;
  margin-right: 0.2rem;
}

.honor .honor_li:last-of-type {
  margin-right: 0;
}

.honor_li img {
  width: 2.22rem;
  height: 1.38rem;
  display: block;
  border-radius: 5px;
}

/* 招商项目 */
.recruit {
  display: block;
}
.recruit_img {
  padding: 0.2rem 0;
  min-height: 4.04rem;
}
.recruit_img img {
  width: 100%;
  height: 100%;
}

/* 经销 */
.agent_li {
  padding: 0.2rem 0;
  border-bottom: 1px solid #f4f4f4;
}
.agent_li:last-of-type {
  border-bottom: none;
}
.agent_li_img {
  width: 2.28rem;
  height: 1.73rem;
  display: block;
  margin-right: 0.12rem;
  object-fit: cover;
}

/* 联系人 */
.contact_li {
  width: 100%;
  padding: 0.25rem 0;
}
.contact_li img {
  width: 0.96rem;
  height: 0.96rem;
  display: block;
}
.contact_icon {
  width: 0.72rem;
  height: 0.72rem;
  line-height: 0.72rem;
  border: 0.01rem solid #ffcccc;
  border-radius: 50%;
  text-align: center;
}
.contact_icon .iconfont {
  font-size: 0.36rem;
  color: #ff0404;
}

/* 最新资讯 */
.news_li {
  border-bottom: 1px solid #e9e9e9;
  padding: 0.2rem 0;
}

.news_li:last-of-type {
  border-bottom: none;
}

.news_li img {
  min-width: 2.27rem;
  max-width: 2.27rem;
  height: 1.72rem;
  border-radius: 5px;
  object-fit: contain;
}

.news_li_s {
  margin-top: 0.1rem;
  height: 0.42rem;
  line-height: 0.42rem;
}

.news_li_tip {
  padding: 0 0.12rem;
  background: #f2f2f2;
  border-radius: 0.05rem;
}
/*  */

.radius-10 {
  border-radius: 0.1rem;
}

.margin-tb30 {
  margin-top: 0.3rem;
  margin-bottom: 0.3rem;
}

.transformY50 {
  transform: translateY(-0.5rem);
}

.border-ff6 {
  border: 0.01rem solid #ff6633;
  display: inline-block;
  padding: 0.06rem 0.08rem;
  border-radius: 0.05rem;
  margin-right: 0.18rem;
}

.margin-b15 {
  margin-bottom: 0.15rem;
}

.padding-tb35 {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

.rem-26px {
  font-size: 0.26rem;
}
.van-overlay .position-center {
  overflow: hidden;
  width: 80%;
  text-align: center;
}
textarea {
  padding: 0.3rem;
}
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
  .footer {
    padding-bottom: 0.68rem !important;
    box-sizing: content-box;
  }
  .news {
    margin-bottom: 2rem;
  }
}
</style>

<style>
.card_page video {
  width: 100% !important;
}
.card_page .recruit_img img,
.card_page .about img {
  width: 100% !important;
}
.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.card_page .z-1003 {
  z-index: 1003;
}
.card_page .h-80 {
  height: 0.8rem;
}
</style>]

<style>
.about_cont p {
  margin-bottom: 14px;
}
</style>